<template>
	<view class="main-box">
		<view class="" @click="changes" v-if="adst==1">
			<image src="https://h5.sx2b2c.com/images/common/float-ad-icon.gif" mode="" class="adbox"></image>
		</view>

		<u-popup v-model="shows" mode="center" width="90%">
			<image src="../../static/gaozhi.jpg" mode="widthFix" style="width: 100%;"></image>
			<view class="" style="height: 100rpx;">

			</view>
			<view style="width: 100%;height: 100rpx;position: fixed;bottom: 0;right:5%;left: 0; ">
				<view class="btns" @click="shows=false" style="margin: 0 auto;">我知道了</view>
			</view>
		</u-popup>
		<u-popup v-model="showx" mode="center" width="90%">
			<image src="../../static/xuzhi1.jpg" mode="widthFix" style="width: 100%;"></image>
			<view class="" style="height: 100rpx;">

			</view>
			<view style="width: 100%;height: 100rpx;position: fixed;bottom: 0;right:5%;left: 0; ">
				<view class="btns" @click="showx=false" style="margin: 0 auto;">我知道了</view>
			</view>
		</u-popup>
		<u-popup v-model="showv" mode="center" width="90%">
			<image src="../../static/xuhizx.jpg" mode="widthFix" style="width: 100%;"></image>
			<view class="" style="height: 100rpx;">

			</view>
			<view style="width: 100%;height: 100rpx;position: fixed;bottom: 0;right:5%;left: 0; ">
				<view class="btns" @click="showv=false" style="margin: 0 auto;">我知道了</view>
			</view>
		</u-popup>
		<u-popup v-model="showm" mode="center" width="90%">
			<image src="../../static/tiaokuanx.jpg" mode="widthFix" style="width: 100%;"></image>
			<view class="" style="height: 100rpx;">

			</view>
			<view style="width: 100%;height: 100rpx;position: fixed;bottom: 0;right:5%;left: 0; ">
				<view class="btns" @click="showm=false" style="margin: 0 auto;">我知道了</view>
			</view>
		</u-popup>





		<image src="../../static/bg.jpg" mode="widthFix" class="images"></image>
		<view class="boxs">
			<view class="box">
				<view style="text-align: center;">
					<image src="../../static/phone.png" mode="scaleToFill" class="phone"></image>
				</view>

				<view class="person">
					今日有{{person}}人领取
				</view>
				<!-- 	<view class="inputs">
					<view class="number">手机号码</view>
					<view class="line">

					</view>
					<u-input v-model="mobile" @input='inputs' maxlength="11" type="number"
						placeholder-style="margin-left:24rpx;color: #D4A777;" class="inputx" style="" />
				</view> -->
				<view class="inputs">
					<view class="number">手机号码</view>
					<view class="line">

					</view>
					<u-input v-model="mobile" input-align='left' @input='inputs' maxlength="11" type="number"
						placeholder-style="color: #D4A777;margin-left:10rpx;" />
				</view>
				<view style="width: 100%;text-align: center;">
					<image src="../../static/get.png" mode="scaleToFill" class="get" @tap="clcpic"></image>
				</view>
				<view class="boss">

					<u-checkbox v-model="checked"></u-checkbox>

					<view class="" style="font-size: 28rpx;">
						本人同意领取免费险并阅读 <text class="xieyi" @tap="showx=true"> 《服务协议》</text> <text class="xieyi"
							@tap="shows=true"> 《客户告知书》</text><text class="xieyi" @tap="showv=true"> 《投保须知》</text><text
							class="xieyi" @tap="showm=true"> 《保险条款》</text>
					</view>

				</view>

			</view>


			<view class="bottom">
				<view class="quanyi">
					权益保障
				</view>
				<view class="lines">

				</view>
				<view class="d_f j_c_s_a" style="margin-top: 44rpx;">
					<view class="" style="width: 33.33%;text-align: center;">
						<image src="../../static/cars.png" mode="" style="width: 70rpx;height: 52rpx;"></image>

					</view>
					<view class="" style="width: 33.33%;text-align: center;">
						<image src="../../static/yiwai.png" mode="" class="picx"></image>

					</view>
					<view class="" style="width: 33.33%;text-align: center;">
						<image src="../../static/zj.png" mode="" style="width: 62rpx; height: 52rpx;"></image>

					</view>

				</view>
				<view class="d_f j_c_s_b" style="margin-top: 28rpx;font-weight: bold; font-size: 36rpx;">
					<view class="" style="text-align: center;width: 33.33%;">
						车险
					</view>
					<view class="" style="text-align: center;width: 33.33%;">
						意外险
					</view>
					<view class="" style="text-align: center;width: 33.33%;">
						重疾险
					</view>
				</view>

			</view>


		</view>


	</view>
</template>

<script>
	import FingerprintJS from '@fingerprintjs/fingerprintjs' // 引入
	import {
		getip,
		getUrl,
		subOrder,
		mobileQuery,
		alipayadsta,
		logs
	} from "../../api/index.js"
	export default {
		data() {
			return {
				deviceid: '',
				showm: false,
				showss: false,
				shows: false,
				showv: false,
				checked: false,
				flag: false,
				mobile: "",
				show: true,
				showx: false,
				a: '',
				num: "",
				param: "",
				person: '',
				orderNo: "",
				adst: 0, //信封显示与否
				url: ""


			};
		},
		onShow() {
			this.getvisitorId()
		},
		onLoad(option) {

		if(option.requestId){
			let a={
				'requestId':option.requestId,
				'adId':option.adId,
				'pn':option.pn
			}
			if(a.requestId==null||a.requestId==undefined||a.requestId=='null'){
				a.requestId=''
			}
			if(a.adId==null||a.adId==undefined||a.adId=='null'){
				a.adId=''
			}
			if(a.pn==null||a.pn==undefined||a.pn=='null'){
				a.pn=''
			}
			console.log(JSON.stringify(a))
			
			uni.setStorageSync('param', JSON.stringify(a))
			this.param=uni.getStorageSync('param')
		}else{
			if (option.adId) {
						this.param = option.adId
						uni.setStorageSync('param', option.adId)
					}
					if (option.urlCode) {
						this.param = option.urlCode
						uni.setStorageSync('param', option.urlCode)
					}
			
					if (option.tokenId) {
						this.param = option.tokenId
						uni.setStorageSync('param', option.tokenId)
					}
					if (option.clickid) {
						uni.setStorageSync('param', option.clickid)
						this.param = option.clickid
					}
					if (option.a_oId) {
						uni.setStorageSync('param', option.a_oId)
						this.param = option.a_oId
					}
					if (option.a_oid) {
						uni.setStorageSync('param', option.a_oid)
						this.param = option.a_oid
					}
					if (option.param) {
						uni.setStorageSync('param', option.param)
						this.param = option.param
					}
		}
			let timeStamp = new Date().getTime()
			console.log(timeStamp)
			this.person = (timeStamp / 20000) - 84740000
			this.person = parseInt(this.person)
			console.log(this.person)
			if (option.a) {
				let reg = RegExp(/extendParam/)
				console.log(reg.test(option.a)) //true
				var result = reg.test(option.a)
				if (result == true) {
					let a = this.$route.query.a.split("&extendParam=")
					console.log(a)
					this.a = a[0]
					console.log(this.a)
					console.log(JSON.parse(a[1]).adId)
					if (a.length > 1) {
						this.param = JSON.parse(a[1]).adId
					}
					const formDatax = new FormData();

					formDatax.append('a', this.a);
					fetch('https://www.sx2b2c.com/api/dhk3000/getAdUrl', {
							method: 'post',
							body: formDatax
						})
						.then(response => response.json())
						.then(data => {
							console.log(data)
							this.adst = data.data.adst
							this.url = data.data.url1 //信封跳转地址


						})
						.catch(error => console.error(error));
				} else {
					uni.setStorageSync('a', option.a)
					this.a = option.a
					const formDatax = new FormData();

					formDatax.append('a', uni.getStorageSync('a'));
					fetch('https://www.sx2b2c.com/api/dhk3000/getAdUrl', {
							method: 'post',
							body: formDatax
						})
						.then(response => response.json())
						.then(data => {
							console.log(data)
							this.adst = data.data.adst
							this.url = data.data.url1 //信封跳转地址


						})
						.catch(error => console.error(error));
				}
			}

			if (option.mobile) {
				this.mobile = option.mobile

				if (this.mobile.length == 11) {

					this.checked = true
				}
			}
	
			console.log(this.param)
		},

		methods: {
			async getvisitorId() {
				const fp = await FingerprintJS.load()
				const result = await fp.get()
				this.deviceid = result.visitorId
				logs({
					a: this.a,
					eventType: 1,
					xcx: 3,
					deviceid: this.deviceid
				}).then((res) => {
					console.log(res)

				})
				console.log(this.deviceid)
			},
			changes() {
				// 在这里编写处理点击事件的逻辑
				window.location.href = this.url
			},
			oks() {
				this.shows = false
			},
			ok() {
				this.showx = false
			},
			//获取订单号
			getRandomNum() {

				var a = new Date().getFullYear() + (new Date().getMonth() + 1).toString().padStart(2, "0") +
					new Date().getDate().toString().padStart(2, "0")
				//  "2020-02-12"   获取的是当前日期
				var b = new Date().getHours().toString().padStart(2, "0") + new Date().getMinutes().toString()
					.padStart(2, "0") + new Date().getSeconds().toString().padStart(2, "0")
				//11:13:02当前时间

				var randomNum = "" + Math.round(Math.random() * 900000000);
				while (randomNum.length < 8) {
					randomNum = "0" + randomNum;
				}


				const number = 'AD' + a + b + randomNum
				this.orderNo = number


				return randomNum;
			},
			//监听手机号变化
			inputs() {

				console.log(this.mobile.length)
				if (this.mobile.length == 11) {
					this.checked = true
					this.clcpic()
				}

			},
			//点击退出h5
			close() {
				// #ifdef H5

				if (/MicroMessenger/.test(window.navigator.userAgent)) {

					WeixinJSBridge.call('closeWindow')

				} else if (/AlipayClient/.test(window.navigator.userAgent)) {
					AlipayJSBridge.call('exitApp')

				} else {


				}
				// #endif


			},

			//点击图片
			clcpic() {
				//每次进入页面刷新记录
				logs({
					a: this.a,
					eventType: 2,
					xcx: 3,
					deviceid: this.deviceid
				}).then((res) => {
					console.log(res)
				})
				this.getRandomNum()
				if (this.mobile.length < 11) {
					console.log(this.mobile)
					console.log(uni.getStorageSync('a'))
					console.log(`https://ulink.alipay.com/?scheme=` +
						encodeURIComponent(
							`alipays://platformapi/startapp?appId=2021004129621025&page=pages/unit/unit&query=${encodeURIComponent('mobile='+this.mobile+'&a='+this.a+'&param='+this.param )}`
						))

					uni.showToast({
						title: '手机号不正确',
						icon: "none"
					}); //弹出提示框
				} else if (this.checked == false) {
					uni.showToast({
						title: '请勾选协议',
						icon: "none"
					});
				} else {
					mobileQuery({
						mobile: this.mobile
					}).then((res) => {
						console.log(res)
						if (res.data.num == 0) {
							getip({}).then((res) => {
								console.log(res.data.city)
								if (res.data.city == "深圳") {
									getUrl({
										a: this.a,
										param: this.param,
										mobile: this.mobile
									}).then((result) => {
										console.log(result.data.ad_h5_to_url)
										if (result.code == 1 && result.data.ad_h5_to_url != '') {
											window.location.href = result.data.ad_h5_to_url

										} else {
											uni.showToast({
												icon: 'none',
												title: '抱歉，当前暂无可领取福利',
												duration: 2000
											});
										}
									})
								} else {
									// #ifdef H5
									uni.setStorageSync('phones', this.mobile)
									if (/MicroMessenger/.test(window.navigator.userAgent)) {
										let system = navigator.userAgent.toLowerCase();
										//微信环境==苹果跳转支付宝
										if (/(iPhone|iPad|iPod|iOS)/i.test(system)) {
											subOrder({
												a: this.a,
												param: this.param,
												mobile: this.mobile,
												nomobile: '2',
												from_t: '1',
												from_env: '2',
												orderNo: this.orderNo
											}).then((res) => {
												window.location.href =
													`https://ulink.alipay.com/?scheme=` +
													encodeURIComponent(
														`alipays://platformapi/startapp?appId=2021004129621025&page=pages/unit/unit&query=${encodeURIComponent('mobile='+this.mobile+'&a='+this.a+'&param='+this.param+'&orderNo='+this.orderNo+'&deviceid='+this.deviceid    )}`
													)
											})
											// wx.navigateToMiniProgram({ appId: '2021004115620105'})
											// extraData: { // 可选，传递给支付宝小程序的额外数据 }, success(res) { // 跳转成功的回调函数 }, fail(res) { // 跳转失败的回调函数 } })
										} else {
											//微信环境==安卓跳转支付宝
											subOrder({
												a: this.a,
												param: this.param,
												mobile: this.mobile,
												nomobile: '2',
												from_t: '2',
												from_env: '2',
												orderNo: this.orderNo
											}).then((res) => {
												uni.navigateTo({
													url: "/pages/lead/lead?mobile=" + this.mobile + '&a=' + this.a +'&param=' + this.param +'&orderNo=' + this.orderNo+'&deviceid='+this.deviceid 
												})
											})
										}
									} else if (/AlipayClient/.test(window.navigator.userAgent)) {
										subOrder({
											a: this.a,
											param: this.param,
											mobile: this.mobile,
											nomobile: '2',
											from_t: '0',
											from_env: '1',
											orderNo: this.orderNo
										}).then((res) => {
											window.location.href =
												`https://ulink.alipay.com/?scheme=` +
												encodeURIComponent(
													`alipays://platformapi/startapp?appId=2021004129621025&page=pages/unit/unit&query=${encodeURIComponent('mobile='+this.mobile+'&a='+this.a+'&param='+this.param+'&orderNo='+this.orderNo+'&deviceid='+this.deviceid     )}`
												)
										})


									} else {
										// 其他环境
										subOrder({
											a: this.a,
											param: this.param,

											mobile: this.mobile,
											nomobile: '2',
											from_t: '0',
											from_env: '0',
											orderNo: this.orderNo
										}).then((res) => {
											window.location.href =
												`https://ulink.alipay.com/?scheme=` +
												encodeURIComponent(
													`alipays://platformapi/startapp?appId=2021004129621025&page=pages/unit/unit&query=${encodeURIComponent('mobile='+this.mobile+'&a='+this.a+'&param='+this.param+'&orderNo='+this.orderNo+'&deviceid='+this.deviceid    )}`
												)
										})


									}
									// #endif
									// #ifdef MP-ALIPAY
									uni.navigateTo({
										url: "/pages/unit/unit"
									})
									my.setStorageSync({
										key: 'phone',
										data: this.mobile
									})
									// #endif

								}
							})
						} else {
							uni.showToast({
								icon: 'none',
								title: '该手机号已办理',
								duration: 2000
							});
						}

					})



				}


			}

		}
	}
</script>

<style lang="scss">
	.adbox {
		position: fixed;
		bottom: 10%;
		right: 0;
		width: 100rpx;
		height: 100rpx;
		z-index: 9999;
	}

	.bottom {

		width: 100%;
		height: 330rpx;
		background: #FFFFFF;
		border-radius: 40rpx;
		z-index: 999;
		position: absolute;

		margin-top: 45rpx;

	}

	.quanyi {
		text-align: center;
		font-size: 34rpx;
		margin-top: 40rpx;
		font-weight: bold;
		color: #541912;

	}

	.lines {
		width: 80%;
		margin: 0 auto;
		height: 1rpx;
		margin-top: 40rpx;
		border-bottom: 1px solid #EBD5B0;
	}

	.xieyi {
		color: #7FB1FF;
	}

	.boss {
		padding: 50rpx 50rpx 0 50rpx;
		width: 100%;
		display: flex;
		font-size: 24rpx;
	}

	.get {
		width: 589rpx;
		height: 106rpx;
		margin-top: 35rpx;

	}

	.number {
		display: flex;
		justify-content: center;
		align-items: center;
		margin-left: 32rpx;
		color: #4E1E1E;
		font-size: 34rpx;
		font-weight: 500;
	}

	.line {
		height: 70rpx;
		margin-top: 10rpx;
		margin-left: 30rpx;

		border: 1px solid #EBD5B0
	}

	.inputs {
		height: 90rpx;
		width: 589rpx;
		margin: 0 auto;
		border: 1px solid #EBD5B0;
		border-radius: 40rpx;
		display: flex;
		align-items: center;
	}

	.inputx {
		border-radius: 40rpx;

	}

	.person {
		width: 100%;
		text-align: center;


		font-size: 30rpx;
		margin-top: 55rpx;
		margin-bottom: 40rpx;
		font-weight: 600;
		color: #D6463E;

	}

	.phone {
		margin-top: 49rpx;
		width: 424rpx;
		height: 40rpx;
		font-size: 36rpx;
		font-weight: bold;
		color: #571B10;
		line-height: 47rpx;

	}

	.agreement-main-box {

		position: fixed;
		left: 0;
		top: 0;
		width: 100vw;
		height: 100vh;
		display: flex;
		justify-content: center;
		align-items: center;
		background: url("https://qiming-1308147483.cos.ap-chengdu.myqcloud.com/doc%2Fpinzhi_shenghuo_huiyuan_quanyi%2Fcommon%2Flogin-shadow-bg.png") repeat;
		z-index: 9999;

		.agreement-box {
			border-radius: 20rpx;
			background-color: #faf7f2;
			padding: 30rpx;
			width: 85%;
			box-sizing: border-box;

			.title {
				text-align: center;
				color: #f94439;
				font-size: 28rpx;
				padding-bottom: 20rpx;
			}

			.content-box {
				max-height: 50vh;
				overflow: auto;

				.content {
					font-size: 25rpx;
					color: #515151;
					margin-top: 30rpx;
					line-height: 45rpx;
				}

			}

			.btn {
				width: 300rpx;
				font-size: 25rpx;
				letter-spacing: 2rpx;
				color: #fff;
				text-align: center;
				background-color: #f94338;
				border-radius: 120rpx;
				padding: 13rpx 0;
				font-size: 32rpx;
				margin: 10rpx auto 0;
			}
		}
	}

	.main-box {
		min-height: 140%;
		position: relative;
		background-color: rgb(250, 80, 63);


	}

	.btns {

		width: 300rpx;

		letter-spacing: 2rpx;
		color: #fff;
		text-align: center;
		background-color: #f94338;
		border-radius: 120rpx;
		padding: 13rpx 0;
		font-size: 32rpx;

	}

	.images {
		position: absolute;
		height: 750rpx;
		width: 100%;
	}

	.box {


		padding-bottom: 100rpx;



	}

	.boxs {
		width: 90%;
		top: 475rpx;
		background: #FFFFFF;
		border-radius: 40rpx;
		z-index: 999;
		position: absolute;
		margin-left: 5%;
	}


	.botm {
		height: 300rpx;
	}

	.picx {
		width: 64rpx;
		height: 64rpx;
	}
</style>